<!DOCTYPE html>

<html>
    <head>
        <meta charset="UTF-8">
        <title>组合框</title>
        <!-- 链接外部样式文件 -->
        <link rel="stylesheet" href="combobox.css">
        <!-- 导入Vue核心库 -->
        <script src="vue@3.2.26.js"></script>
    </head>
    <body>

        <h3>组合框</h3>
        <p>在自定义组件中使用 v-model 指令</p>

        <div id="combobox">
            <div class="result" @mouseover="showCombobox">{{year}}</div>
            <combobox v-if="show" 
                      v-model="year"
                      :begin="begin" 
                      :end="end" 
                      ></combobox>

            <!--
            <combobox v-if="show" 
                      :model-value="year" 
                      @update:model-value="handleUpdate"
                      :begin="begin" 
                      :end="end" 
                      ></combobox>
            -->
        </div>

        <!-- 导入Vue核心库 -->
        <script src="combobox.js"></script>
        
    </body>
</html>